<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel = "stylesheet" href="css/audiogame.css" />
    <title>Document</title>
</head>
<body>
   <div id ="game">
       <section id = "menu-scene" class = "scene">
        <a href = "#game"><span>Play</span></a>
       </section>
       <section id = "game-scene" class="scene">
           <canvas id = "game-background-canvas" width="768" height="440">
               对不起，您的浏览器不支持canvas 标签
           </canvas>
           <canvas id = "game-canvas" width="768" height="440"></canvas>
       </section>
       <section id = "gameover-scene" class = "scene"></section>
       <section id = "credit-scene" class = "scene"></section>
       <section id = "leaderboard-scene" class = "scene"></section>
       <div id = "hit-line-1" class = "hit-line hide"></div>
       <div id = "hit-line-2" class = "hit-line hide"></div>
       <div id = "hit-line-3" class = "hit-line hide"></div>
   </div>
   <footer>
       <p>This is an example of making audio game in HTML5. press J, K, L to play.</p>
   </footer>
         <audio id = "melody">
            <source src="media/minuet_in_g_Melody.mp3" />
        </audio>
        <audio id = "base"  > 
            <source src = "media//Minuet_in_G.mp3" />
         </audio>
        <audio id ="buttonover"  >
         <source src="media/button_over.wav" />
         <source src = "media/button_over.ogg" />
     </audio>
     <audio id = "buttonactive">
         <source src="media/button_active.mp3" />
         <source src = "media/button_active.ogg" />
     </audio>

   <script src="js/jquery-3.3.1.min.js" ></script>
   <script src = "js/html5games.audio.js"></script>
</body>
</html>